<template>
  <!-- <el-row> -->
    <!-- <el-container style="height: 100%;"> -->
      
      <el-container style="overflow:hidden;width:100%;height: 100%;">
        <el-aside width="200px" height="100%" style="background-color:#303133;">
          <left-nav :menuList="menuList"></left-nav>
        </el-aside>
        <el-main height="auto" style="width:100%;background:#F8F9FA;padding:0;">
          <el-header style="width:100%;height: auto; padding:0;margin:0;">
            <div style="height: 50px;">
              <top></top>
            </div>
            <div >
              <crumbs></crumbs>
            </div>
          </el-header>
          <div class="pageAll" style="width:100%;padding:20px;box-sizing: border-box;">
            <transition name="fade-page" mode="out-in">
              <router-view></router-view>
            </transition>
          </div>
        </el-main>
      </el-container>
    <!-- </el-container> -->
  <!-- </el-row> -->
</template>



<style scoped>
/*  transition scss */
.fade-page-enter-active,
.fade-page-leave-active {
  transition: all 0.5s;
}
.fade-page-enter {
  opacity: 0;
  transform: translateX(-30px);
}
.fade-page-leave-to {
  opacity: 0;
  transform: translateX(-30px);
}


</style>

<script>
import top from '@/components/assembly/steleTop'
import crumbs from '@/components/assembly/crumbs'
import leftNav from '@/components/assembly/leftNav'
import {
  mapState,
  createNamespacedHelpers,
} from "vuex";
let {
  mapGetters,
  mapActions
} = createNamespacedHelpers("adminBasic");

export default {
  data() {
    return {
      jwtAuth: {},
      menuList: [],
    }
  },
  computed: {
    
  },
  components: {
    top,
    crumbs,
    leftNav
  },
  created() {
    this.jwtAuth = JSON.parse(sessionStorage.getItem('jwtAuth'));
    this.initMenuList();
  },
  mounted() {
    
  },
  methods: {
    ...mapActions([
      "getJurisdictionList",
      'formGet'
    ]),

    initMenuList() {
      this.formGet({
        API: 'queryMenuListByAccountId',
        data: {
          accountId: this.jwtAuth.accountId,
        }
      }).then(res => {

        res.menuList.forEach((item, index) => {
          item.index = `${index + 1}`
          item.icon = `http://www.mingxiaoclub.cn/manageSys/menuIcon/${item.icon}.png`
          if(item.children) {
            item.name = '';
            item.children.forEach((childItem, childIndex) => {
              childItem.index = `${item.index}-${childItem.index}`
            })
          }
        })

        
        this.menuList = res.menuList;

      }).catch(err => {
        this.$message.error(err);
      })
    }
  }
}

</script>
